<style>
    .box{
        display: flex;
        flex-wrap: wrap;
    }
    .box >div{
        margin-bottom: 20px;
        margin-right: 20px;
    }
</style>
<div class="layuimini-container">
    <form id="app-form" class="layui-form layuimini-form">
        <div class="layui-form-item">
            <label class="layui-form-label">达人分组</label>
            <div class="layui-input-block">
                <select name="expert_group_id" class="layui-input" lay-filter="province">
                    <option value="0">请选择</option>
                    {volist name="expert_group" id="v"}
                        <option value="{$v.id}" {if condition="$row.expert_group_id eq $v.id"}selected{/if}>{$v.title}</option>
                    {/volist}
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">达人名称</label>
            <div class="layui-input-block">
                <input type="text" name="service_name" class="layui-input" placeholder="请输入达人名称" value="{$row.service_name|default=''}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">头像</label>
            <div class="layui-input-block layuimini-upload">
                <input name="image" class="layui-input layui-col-xs6" readonly  placeholder="请上传头像" value="{$row.service_img|default=''}">
                <div class="layuimini-upload-btn">
                    <span><a class="layui-btn" data-upload="image" data-upload-number="one" data-upload-exts="png|jpg|ico|jpeg" data-upload-icon="image"><i class="fa fa-upload"></i> 上传</a></span>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">轮播图</label>
            <div class="layui-input-block layuimini-upload">
                <input name="logo" class="layui-input layui-col-xs6" readonly  placeholder="请上传轮播图" value="{$row.lun_img|default=''}">
                <div class="layuimini-upload-btn">
                    <span><a class="layui-btn" data-upload="logo" data-upload-number="more" data-upload-exts="png|jpg|ico|jpeg" data-upload-icon="logo"><i class="fa fa-upload"></i> 上传</a></span>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">手机号</label>
            <div class="layui-input-block">
                <input type="number" name="phone" class="layui-input" maxlength="11" placeholder="请输入手机号" value="{$row.phone|default=''}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">登录密码</label>
            <div class="layui-input-block">
                <input type="password" name="password" class="layui-input"  placeholder="请输入登录密码" value="{$row.password|default=''}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <select name="sex" class="layui-input" lay-filter="sex">
                    <option value="0">请选择</option>
                    <option value="1" {if condition="$row.sex eq 1"}selected{/if}>男</option>
                    <option value="2" {if condition="$row.sex eq 2"}selected{/if}>女</option>
                </select>
            </div>
        </div>
 
        <div class="layui-form-item" id="biaonan" style="display: none;">
            <label class="layui-form-label">标签</label>
                <div class="layui-input-block" >
                    {volist name="label_nan" id="v"}
                    <input type="checkbox" name="label_id[]" lay-filter="levelM" class="layui-input" value="{$v.id}" title="{$v.name}"  {if condition="in_array($v.id,$row.label_id)"}checked{/if}>
                    {/volist}
                </div>
        </div>
        <div class="layui-form-item" id="biaonv" style="display: none;">
            <label class="layui-form-label">标签</label>
                <div class="layui-input-block" >
                    {volist name="label_nv" id="v"}
                    <input type="checkbox" name="label_id[]" lay-filter="levelM" class="layui-input" value="{$v.id}" title="{$v.name}"  {if condition="in_array($v.id,$row.label_id)"}checked{/if}>
                    {/volist}
                </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label required">年龄</label>
            <div class="layui-input-block">
                <input type="number" name="age" class="layui-input" placeholder="请输入年龄" value="{$row.age|default=''}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">擅长</label>
            <div class="layui-input-block">
                <input type="text" name="proficient_in" class="layui-input" placeholder="请输入擅长" value="{$row.proficient_in|default=''}">
                <tip>多个用英文逗号分割</tip>
            </div>
           
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">简介</label>
            <div class="layui-input-block">
                <textarea name="brief_introduction" rows="10" class="layui-textarea" placeholder="请输入简介">{$row.brief_introduction|default=''}</textarea>
            </div>
        </div>
        <input type="hidden" id="type" value="{$row.sex}">
        <div class="hr-line"></div>
        <div class="layui-form-item text-center">
            <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit>确认</button>
            <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">重置</button>
        </div>
    </form>
</div>
<script type="text/javascript">
    layui.use(['form','upload'], function(){
        var form = layui.form;
        var upload = layui.upload;
        $ = layui.$;
        type =  $("#type").val()
        if(type == 1){
            $("#biaonan").show();
            $("#biaonv").hide();
        }else if(type == 2){
            $("#biaonv").show();
            $("#biaonan").hide();
        }
        //各种基于事件的操作。
        form.on('select(sex)', function(data){
            var level = data.value;//被点击的select的value值
            //TODO 下面是我具体业务的处理代码，可忽略 ...
            if(level == 1){
                var checkboxes = document.querySelectorAll('input[type="checkbox"]');
                checkboxes.forEach(function(checkbox) {
                    checkbox.checked = false;
                });
                layui.form.render('checkbox');
                $("#biaonan").show();
                $("#biaonv").hide();
            }else if(level == 2){
                var checkboxes = document.querySelectorAll('input[type="checkbox"]');
                checkboxes.forEach(function(checkbox) {
                    checkbox.checked = false;
                });
                layui.form.render('checkbox');
                $("#biaonv").show();
                $("#biaonan").hide();
            }
        });

    });
</script>